<!-- 模型定义编辑弹窗 -->
<template>
  <div class="ele-body">
    <h2 style="font-size: 30px;text-align: center">石试验原始记录</h2>
    <a-card :title="modelModalApp.title" :bordered="false" class="clean-a-card">
      <!--      <a-form
              ref="form2"
              :model="modelModalApp.model"
              :rules="modelModalApp.rules"
              :label-col="{md: {span: 7}, sm: {span: 24}}"
              :wrapper-col="{md: {span: 17}, sm: {span: 24}}">
              <a-row :gutter="16">

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="模型名:" name="modelName">
                    <a-input
                      v-model:value="modelModalApp.model.modelName"
                      placeholder="请输入模型名"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="Sql字符串:" name="sqlString">
                    <a-input
                      v-model:value="modelModalApp.model.sqlString"
                      placeholder="请输入Sql字符串"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="创造:" name="createAt">
                    <a-input
                      v-model:value="modelModalApp.model.createAt"
                      placeholder="请输入创造"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="更新:" name="updateAt">
                    <a-input
                      v-model:value="modelModalApp.model.updateAt"
                      placeholder="请输入更新"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="模型类型:" name="modelType">
                    <a-input
                      v-model:value="modelModalApp.model.modelType"
                      placeholder="请输入模型类型"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="报表类型:" name="reporterType">
                    <a-input
                      v-model:value="modelModalApp.model.reporterType"
                      placeholder="请输入报表类型"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="出版模式:" name="publishMode">
                    <a-input
                      v-model:value="modelModalApp.model.publishMode"
                      placeholder="请输入出版模式"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="开始日期:" name="startDays">
                    <a-input-number
                      v-model:value="modelModalApp.model.startDays"
                      placeholder="请输入开始日期"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="填写天数:" name="fillInDays">
                    <a-input-number
                      v-model:value="modelModalApp.model.fillInDays"
                      placeholder="请输入填写天数"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="父模型名字:" name="parentModelId">
                    <a-input-number
                      v-model:value="modelModalApp.model.parentModelId"
                      placeholder="请输入父模型名字"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="发布操作员名字:" name="publishOperatorId">
                    <a-input-number
                      v-model:value="modelModalApp.model.publishOperatorId"
                      placeholder="请输入发布操作员名字"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="出版日期:" name="publishDate">
                    <a-date-picker
                      v-model:value="modelModalApp.model.publishDate"
                      placeholder="请选择出版日期"
                      value-format="YYYY-MM-DD H:m:s"
                      class="ele-fluid"/>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="发布状态:" name="publishStatus">
                    <a-input
                      v-model:value="modelModalApp.model.publishStatus"
                      placeholder="请输入发布状态"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="在js之前保存:" name="saveBeforeJs">
                    <a-input
                      v-model:value="modelModalApp.model.saveBeforeJs"
                      placeholder="请输入在js之前保存"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="Js后保存:" name="saveAfterJs">
                    <a-input
                      v-model:value="modelModalApp.model.saveAfterJs"
                      placeholder="请输入Js后保存"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="剧本:" name="script">
                    <a-input
                      v-model:value="modelModalApp.model.script"
                      placeholder="请输入剧本"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="是否需要附件:" name="isNeedAnnex">
                    <a-input
                      v-model:value="modelModalApp.model.isNeedAnnex"
                      placeholder="请输入是否需要附件"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="儿童票据类型:" name="childrenBillType">
                    <a-input
                      v-model:value="modelModalApp.model.childrenBillType"
                      placeholder="请输入儿童票据类型"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="表格类型:" name="formType">
                    <a-input
                      v-model:value="modelModalApp.model.formType"
                      placeholder="请输入表格类型"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="跨行名称定义:" name="crossRowNameDefines">
                    <a-input
                      v-model:value="modelModalApp.model.crossRowNameDefines"
                      placeholder="请输入跨行名称定义"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="模型项定义:" name="modelItemsDefines">
                    <a-input
                      v-model:value="modelModalApp.model.modelItemsDefines"
                      placeholder="请输入模型项定义"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="公式:" name="formulas">
                    <a-input
                      v-model:value="modelModalApp.model.formulas"
                      placeholder="请输入公式"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="是调整:" name="isAduit">
                    <a-input
                      v-model:value="modelModalApp.model.isAduit"
                      placeholder="请输入是调整"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="部门名字:" name="departmentId">
                    <a-input-number
                      v-model:value="modelModalApp.model.departmentId"
                      placeholder="请输入部门名字"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="是直的:" name="isDirect">
                    <a-input
                      v-model:value="modelModalApp.model.isDirect"
                      placeholder="请输入是直的"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="组ID:" name="groupId">
                    <a-input-number
                      v-model:value="modelModalApp.model.groupId"
                      placeholder="请输入组ID"
                      :min="0"
                      :step="1"
                      class="ele-fluid"
                    ></a-input-number>
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="填写说明:" name="fillExplanation">
                    <a-input
                      v-model:value="modelModalApp.model.fillExplanation"
                      placeholder="请输入填写说明"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :lg="6" :md="12" :sm="24" :xs="24">
                  <a-form-item label="不创建定义:" name="notCreateDefines">
                    <a-input
                      v-model:value="modelModalApp.model.notCreateDefines"
                      placeholder="请输入不创建定义"
                      :maxlength="255"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>

                <a-col :md="12" :sm="24" :xs="24">
                  <a-form-item :wrapper-col="{md: {offset: 6}}" style="margin-bottom: -20px">
                    &lt;!&ndash;class="ele-pull-right"&ndash;&gt;
                    <div v-if="modelModalApp.display">
                      <teleport to="#modelEditModalFooter">
                        <div>
                          <a-space size="middle">
                            <a-button @click="modelListApp.editModalShowing=false">取消
                            </a-button>
                            <a-button
                              type="primary"
                              @click="onSubmit(modelModalApp.model)"
                              :loading="loading">提交
                            </a-button>
                            &lt;!&ndash;<a-button v-if="!eid"
                                      type="dashed"
                                      @click="continueSubmit"
                                      :loading="loading">继续提交
                            </a-button>&ndash;&gt;
                          </a-space>
                        </div>
                      </teleport>
                    </div>
                    <div v-if="!modelModalApp.display">
                      <a-space size="middle">
                        <a-button @click="onBack()">返回列表</a-button>
                        <a-button
                          type="primary"
                          @click="onSubmit(modelModalApp.model)"
                          :loading="loading">提交
                        </a-button>
                        &lt;!&ndash;<a-button v-if="!eid"
                                  type="dashed"
                                  @click="continueSubmit"
                                  :loading="loading">继续提交
                        </a-button>&ndash;&gt;
                      </a-space>
                    </div>

                  </a-form-item>
                </a-col>
              </a-row>
            </a-form>-->
      <table class=MsoNormalTable border=1 cellspacing=0>
        <tr>
          <td width=88 valign=center colspan=2>
            试验编号
          </td>
          <td width=204 valign=center colspan=6 >
            <div>
              <a-input
                v-model:value="modelModalApp.model.modelName"
                placeholder="请输入试验编号名"
                class="clean"
                :maxlength="255"
                allow-clear
              />
            </div>
          </td>
          <td width=99 valign=center colspan=5>
            试验日期
          </td>
          <td width=263 valign=center colspan=10>
            <a-date-picker
              v-model:value="modelModalApp.model.publishDate"
              style="border: 0"
              placeholder="请选择出版日期"
              value-format="YYYY-MM-DD H:m:s"
              class="date-clean ele-fluid"/>
          </td>
        </tr>
        <tr>
          <td width=88 valign=center colspan=2>
            产 &nbsp;地
          </td>
          <td width=204 valign=center colspan=6>
            <div>
              <a-input
                v-model:value="modelModalApp.model.modelName"
                class="clean"
                placeholder="请输入场地"
                :maxlength="255"
                allow-clear
              />
            </div>
          </td>
          <td width=99 valign=center colspan=5>
            代表批量
          </td>
          <td width=263 valign=center colspan=10>
            <a-input-number
              v-model:value="modelModalApp.model.publishOperatorId"
              placeholder="请输入发布操作员名字"
              :min="0"
              :step="1"
              class="ele-fluid clean"
            ></a-input-number>
          </td>
        </tr>
        <tr>
          <td width=88 valign=center colspan=2>
            试验品种
          </td>
          <td width=204 valign=center colspan=6>
            <a-select
              v-model:value="value"
              show-search
              placeholder="请选择试验品种"
              style="width: 204px;"
              :options="options"
              class="select-clean"
            >
            </a-select>
          </td>
          <td width=99 valign=center colspan=5>
            试验温湿度
          </td>
          <td width=263 valign=center colspan=10>
            <a-row :gutter="16">
              <a-col :lg="10" :md="12" :sm="24" :xs="24">
                <a-input
                  v-model:value="modelModalApp.model.modelName"
                  class="clean"
                  :maxlength="255"
                  allow-clear
                />
              </a-col>
              <a-col :lg="2" :md="12" :sm="24" :xs="24">
               <span class="span-style"> ℃</span>
              </a-col>
              <a-col :lg="10" :md="12" :sm="24" :xs="24">
                <a-input
                  v-model:value="modelModalApp.model.modelName"
                 class="clean"
                  :maxlength="255"
                  allow-clear
                />
              </a-col>
              <a-col :lg="2" :md="12" :sm="24" :xs="24">
               <span class="span-style"> %</span>
              </a-col>
            </a-row>
          </td>
        </tr>
        <tr>
          <td width=88 valign=center colspan=2>
            主要仪器设备
          </td>
          <td width=567 valign=center colspan=21>
            <a-textarea
              class="clean"
              v-model:value="value2"
              placeholder="请输入主要仪器设备"
              :auto-size="{ minRows: 1, maxRows: 5 }"
            />
          </td>
        </tr>
        <tr>
          <td width=36 valign=center rowspan=6>
            筛分析
          </td>
          <td width=107 valign=center colspan=2>
            试样质量
          </td>
          <td width=511 valign=center colspan=20>
            <a-textarea
              class="clean"
              v-model:value="value2"
              placeholder="请输入试样质量"
              :auto-size="{ minRows: 1, maxRows: 5 }"
            />
          </td>
        </tr>
        <tr>
          <td width=107 valign=center colspan=2>
            方孔筛筛孔边长 筛孔公称直径(mm)
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
          <td width=41 valign=center colspan=2>
            75.0
            <a-input
              v-model:value="modelModalApp.model.modelName"
              class="clean"
              placeholder="请输入模型名"
              :maxlength="255"
              allow-clear
            />
          </td>
        </tr>
      </table>
    </a-card>
  </div>

</template>

<script>
import {defineComponent, inject, reactive, onMounted, ref} from 'vue'
import {useRoute, useRouter} from "vue-router"
import {ModelService} from "@/views/lims/gen/model/modelService";
import {VXETable} from 'vxe-table'
import {useStore} from "vuex";
import regions from 'ele-admin-pro/packages/regions.js';

export default defineComponent({
  components: {},
  setup() {
    //文本框
    const value2 = ref('');
    // 省市区数据
    const cityData = regions
    const route = useRoute();
    const router = useRouter();
    const store = useStore();
    let routeId = route.params.id;
    let modelListApp = inject('modelListApp', reactive({}));
    const modelModalApp = reactive({
      id: null,
      model: {},
      isEdit: false,
      display: false
    });
    modelModalApp.rules = {
      modelName: [
        {
          required: true,
          type: 'string',
          message: '请输入模型名',
          trigger: 'blur'
        }
      ],
      sqlString: [
        {
          required: false,
          type: 'string',
          message: '请输入Sql字符串',
          trigger: 'blur'
        }
      ],
      createAt: [
        {
          required: true,
          type: 'string',
          message: '请输入创造',
          trigger: 'blur'
        }
      ],
      updateAt: [
        {
          required: true,
          type: 'string',
          message: '请输入更新',
          trigger: 'blur'
        }
      ],
      modelType: [
        {
          required: false,
          type: 'string',
          message: '请输入模型类型',
          trigger: 'blur'
        }
      ],
      reporterType: [
        {
          required: false,
          type: 'string',
          message: '请输入报表类型',
          trigger: 'blur'
        }
      ],
      publishMode: [
        {
          required: false,
          type: 'string',
          message: '请输入出版模式',
          trigger: 'blur'
        }
      ],
      startDays: [
        {
          required: false,
          type: 'number',
          message: '请输入开始日期',
          trigger: 'blur'
        }
      ],
      fillInDays: [
        {
          required: false,
          type: 'number',
          message: '请输入填写天数',
          trigger: 'blur'
        }
      ],
      parentModelId: [
        {
          required: false,
          type: 'number',
          message: '请输入父模型名字',
          trigger: 'blur'
        }
      ],
      publishOperatorId: [
        {
          required: false,
          type: 'number',
          message: '请输入发布操作员名字',
          trigger: 'blur'
        }
      ],
      publishDate: [
        {
          required: false,
          type: 'string',
          message: '请输入出版日期',
          trigger: 'blur'
        }
      ],
      publishStatus: [
        {
          required: false,
          type: 'string',
          message: '请输入发布状态',
          trigger: 'blur'
        }
      ],
      saveBeforeJs: [
        {
          required: false,
          type: 'string',
          message: '请输入在js之前保存',
          trigger: 'blur'
        }
      ],
      saveAfterJs: [
        {
          required: false,
          type: 'string',
          message: '请输入Js后保存',
          trigger: 'blur'
        }
      ],
      script: [
        {
          required: false,
          type: 'string',
          message: '请输入剧本',
          trigger: 'blur'
        }
      ],
      isNeedAnnex: [
        {
          required: false,
          type: 'string',
          message: '请输入是否需要附件',
          trigger: 'blur'
        }
      ],
      childrenBillType: [
        {
          required: false,
          type: 'string',
          message: '请输入儿童票据类型',
          trigger: 'blur'
        }
      ],
      formType: [
        {
          required: false,
          type: 'string',
          message: '请输入表格类型',
          trigger: 'blur'
        }
      ],
      crossRowNameDefines: [
        {
          required: false,
          type: 'string',
          message: '请输入跨行名称定义',
          trigger: 'blur'
        }
      ],
      modelItemsDefines: [
        {
          required: false,
          type: 'string',
          message: '请输入模型项定义',
          trigger: 'blur'
        }
      ],
      formulas: [
        {
          required: false,
          type: 'string',
          message: '请输入公式',
          trigger: 'blur'
        }
      ],
      isAduit: [
        {
          required: false,
          type: 'string',
          message: '请输入是调整',
          trigger: 'blur'
        }
      ],
      departmentId: [
        {
          required: false,
          type: 'number',
          message: '请输入部门名字',
          trigger: 'blur'
        }
      ],
      isDirect: [
        {
          required: false,
          type: 'string',
          message: '请输入是直的',
          trigger: 'blur'
        }
      ],
      groupId: [
        {
          required: false,
          type: 'number',
          message: '请输入组ID',
          trigger: 'blur'
        }
      ],
      fillExplanation: [
        {
          required: false,
          type: 'string',
          message: '请输入填写说明',
          trigger: 'blur'
        }
      ],
      notCreateDefines: [
        {
          required: false,
          type: 'string',
          message: '请输入不创建定义',
          trigger: 'blur'
        }
      ],
    }

    onMounted(() => {
      //清理数据
      modelModalApp.model = reactive({});
      if (routeId) {//路由
        modelModalApp.id = routeId;
        modelModalApp.display = false;
        findModel(modelModalApp.id);
      } else if (modelListApp.editModalForEdit) {//修改弹窗
        modelModalApp.id = modelListApp.currentId;
        modelModalApp.display = true;
      } else if (!modelListApp.editModalForEdit && modelListApp.addModalForEdit) {//新增弹窗
        modelModalApp.display = true;
      } else {
        modelModalApp.title = "新增学生";
      }
      if (modelModalApp.id) findModel(modelModalApp.id);
    })

    const findModel = (id) => {
      ModelService.findModelForView(id).then((res) => {
        modelModalApp.model = res.data;
        //TODO:为编辑准备.
        modelModalApp.title = "编辑学生 " + modelModalApp.model.name;
      }).catch(error => {
        VXETable.modal.message({content: `查找学生出错，原因是：${error.message}`, status: 'error'});
      })
    }

    /*TODO:提交 新增&编辑*/
    const onSubmit = (data) => {
      // debugger;
      //当为数组时用逗号连接
      if (data.eid) {
        //修改
        ModelService.updateModel(data).then((res) => {
          console.log(res);
          VXETable.modal.message({content: '操作成功', status: 'success'});
          setTimeout(onBack, 3000);
        }).catch(error => {
          VXETable.modal.message({content: `系统错误，原因是：${error.message}`, status: 'error'});
        })
      } else {
        //新增
        ModelService.saveModel(data).then((res) => {
          console.log(res);
          VXETable.modal.message({content: '操作成功', status: 'success'});
          setTimeout(onBack, 3000);
        }).catch(error => {
          VXETable.modal.message({content: `系统错误，原因是：${error.message}`, status: 'error'});
        })
      }
    }

    /*TODO:继续提交*/
    const continueSubmit = () => {
      VXETable.modal.message({content: 'error 提示', status: 'error'});
    }

    /*TODO:返回列表*/
    const onBack = () => {
      router.push(`/lims/gen/model`);
      store.dispatch('user/tabRemove', route.fullPath);

    }
    /*TODO:试验品种*/
    const options = ref([
      {
        value: '品种1',
        label: '品种1',
      },
      {
        value: '品种2',
        label: '品种2',
      },
      {
        value: '品种3',
        label: '品种3',
      },
    ]);
    const filterOption = (input, option) => {
      return option.value.toLowerCase().indexOf(input.toLowerCase()) >= 0;
    };


    return {
      cityData,
      routeId,
      modelListApp,
      modelModalApp,
      onSubmit,
      continueSubmit,
      onBack,

      filterOption,
      options,
      value2,

    }

  },
})
</script>

<style scoped >
.clean-a-card{
  margin-left:50% ;
  left: -384px;
}
.select-clean >>> .ant-select-selector{
  border-color: #ffffff !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.date-clean >>> .ant-input{
  border-color: #ffffff !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.clean{
  border-color: #ffffff !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.span-style{
  margin-left: -8px;
}
table{
  border: 0;
  border-collapse:separate;
}
</style>
